{extend name="public/world"}
{block name="style"}
<style type="text/css">
    .layui-table-cell .role-type1 {margin-left:0;}
    .layui-table-cell .role-type2 {margin-left:30px;}
    .layui-table-cell .role-type3 {margin-left:60px;}
    .layui-table-cell .role-type4 {margin-left:90px;}
    .layui-table-cell .role-type5 {margin-left:120px;}
    .layui-table-cell .role-type6 {margin-left:150px;}
    .layui-table-cell .role-type7 {margin-left:180px;}
    .layui-table-cell .role-type8 {margin-left:210px;}
    .layui-table-cell .role-type9 {margin-left:240px;}
    .triangle0 {
        margin-right:10px;
        padding: 0 5px;
        text-align: center;
        color: #fff;
        font-size: 14px;
        height: 22px;
        line-height: 22px;
        position: relative;
        display: inline-block;
        background: #61bcff;
    }
    .triangle0:before {
        content: "";
        position: absolute;
        left: 100%;
        width: 0;
        height: 0;
        border-top: 11px solid transparent;
        border-bottom: 11px solid transparent;
        border-left: 11px solid #678eab;
    }
    .triangle1{
        font-family: layui-icon!important;
        font-size: 16px;
        font-style: normal;
        -webkit-font-smoothing: antialiased;
        position: relative;
        display: inline-block;
    }
    .triangle1:before{
        content: "\e612";
        color: #678eab;
    }
</style>
{/block}
{block name="container"}
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body">
            <table class="layui-hide" id="dataTable" lay-filter="dataTable"></table>
        </div>
    </div>
</div>
{/block}
{block name="script"}
<script type="text/html" id="statusTpl">
</script>
<script type="text/html" id="barDemo">
{if isset($sonAuth['edit'])}
    <input type="checkbox" name="status" value="{{ d.status }}" lay-skin="switch" lay-filter="switchStatus" lay-text="正常|禁用" {{ d.status == 1 ? 'checked' : '' }} data-href="{:url('/setting.SystemRole/edit')}?id={{ d.id }}"{{# if(d.child){ }} disabled{{# } }}>
    <a href="{:url('/setting.SystemRole/edit')}?id={{ d.id }}" class="layui-btn layui-btn-xs j-iframe-pop" lxb-data="{width: '560px', height: '550px'}" title="修改部门"><i class="layui-icon">&#xe642;</i></a>
{/if}
{if isset($sonAuth['add'])}
    {{# if(d.type < 6 && d.sys==0){ }}
    <a href="{:url('/setting.SystemRole/add')}?pid={{ d.id }}" class="layui-btn layui-btn-xs j-iframe-pop layui-btn-normal" lxb-data="{width: '560px', height: '550px'}" title="添加部门"><i class="layui-icon">&#xe654;</i></a>
    {{# } }}
{/if}
{if isset($sonAuth['role'])}
    {{# if(d.sys==1){ }}
    <a href="{:url('/setting.SystemRole/role')}?id={{ d.id }}" class="layui-btn layui-btn-xs layui-btn-warm">权限分配</a>
    {{# } }}
{/if}
{if isset($sonAuth['del'])}
    {{# if(d.child==0){ }}
    <a href="{:url('/setting.SystemRole/del')}?id={{ d.id }}" class="layui-btn layui-btn-xs layui-btn-danger j-tr-del">删除</a>
    {{# } }}
{/if}
</script>
<script type="text/html" id="toolbar">
{if isset($sonAuth['add'])}
    <div class="layui-btn-group fl">
        <a href="{:url('/setting.SystemRole/add')}" class="layui-btn layuiadmin-btn-admin j-iframe-pop" lxb-data="{width: '560px', height: '550px'}" title="添加部门/职位">添加部门/职位</a>
    </div>
{/if}
</script>
<script>
    layui.use(['tree','table'], function() {
        var table = layui.table;
        table.render({
            elem: '#dataTable'
            ,url: "{:url('/setting.SystemRole/index')}" //数据接口
            ,method: 'post'
            ,page: false //开启分页
            ,toolbar: '#toolbar'
            ,defaultToolbar: false
            ,cols: [[ //表头
                {field: 'id', title: 'ID', width:50}
                , {field: 'role_name', title: '部门名称',templet: function(d) {
                        return '<div class="role-type'+d.type+' triangle'+d.sys+'">' + d.role_name + '</div><span class="layui-badge">'+d.sale+'</span>'
                    }}
                ,{fixed: 'right', title: '操作', templet: '#barDemo'}
            ]]
        });
    });
</script>
{/block}